<div class="dome-storage">
  <loading ng-if="isLoading"></loading>
  <div class="dome-option-container">
    <button class="ui-btn ui-btn-lg ui-btn-bright" ui-sref="createStorage"><span class="btn-txt">新建存储</span><i class="fa fa-plus"></i></button>
    <div class="option-right"><span ng-cloak="ng-cloak">共{{storageFilter.length || 0}}个存储</span>
      <input class="ui-input-search ui-input-fill" type="text" placeholder="输入存储名称查询" ng-model="proKeywords"/>
    </div>
  </div>
  <div class="dome-prompt-container">
    <dome-prompt content="Gdocker系统支持关联已有共享存储服务，并配置用户使用权限。"></dome-prompt>
  </div>
  <!-- 
   <div  class="dome-list-container">
	   <div class="monitor-option">
		   	  <span class="option-title">集群     </span>
		      <div class="com-select-con" select-con="select-con">
		        <button class="ui-btn ui-btn-white ui-btn-select" sg-cloak="sg-cloak">{{clusterListIns.cluster.name||'选择集群'}}<i class="icon-down"></i></button>
		        <ul class="select-list">
		          <li class="select-item" ng-if="!clusterListIns.clusterList || clusterListIns.clusterList.length===0"><a>无相关信息</a></li>
		          <li class="select-item" ng-repeat="cluster in clusterListIns.clusterList"><a ng-bind="cluster.name" ng-click="toggleCluster($index)"></a></li>
		        </ul>
		      </div>
	    </div>
  </div>
   -->
  
  <div class="mod-monitor storage-manage">
	  <div class="monitor-options">
		    <div class="monitor-option"><span class="option-title">集群</span>
		      <div class="com-select-con" select-con="select-con">
		        <button class="ui-btn ui-btn-white ui-btn-select" sg-cloak="sg-cloak">{{clusterListIns.cluster.name||'选择集群'}}<i class="icon-down"></i></button>
		        <ul class="select-list">
		          <li class="select-item" ng-if="!clusterListIns.clusterList || clusterListIns.clusterList.length===0"><a>无相关信息</a></li>
		          <li class="select-item" ng-repeat="cluster in clusterListIns.clusterList"><a ng-bind="cluster.name" ng-click="toggleCluster($index)"></a></li>
		        </ul>
		      </div>
		    </div>
		     <div class="monitor-option"><span class="option-title">namespace</span>
		      <div class="com-select-con" select-con="select-con">
		        <button class="ui-btn ui-btn-white ui-btn-select" sg-cloak="sg-cloak">{{selectedNamespace.name||'选择namespace'}}<i class="icon-down"></i></button>
		        <ul class="select-list">
		          <li class="select-item" ng-if="!namespace || namespace.length===0"><a>无相关信息</a></li>
			      <li class="select-item" ng-repeat="n in namespace"><a ng-bind="n.name" ng-click="toggleNamespace($index)"></a></li>
		        </ul>
		      </div>
		    </div>
	   </div>

    </div>
  
  
  <div class="dome-list-container">
    <ul>
      <li class="dome-list-item-no" ng-if="!isLoading&amp;&amp;(!storageList||storageFilter.length===0)"><span>暂无存储，可以</span><a class="txt-bright" ui-sref="createStorage">新建一个</a></li>
      <li class="dome-list-item" ng-repeat="storage in storageFilter=(storageList|filter:{name:proKeywords}|orderBy:orderBy.createTime:orderBy.isReverse)">
        <div class="dome-list-item-header"><a class="item-header-name" ng-if="!storage.isEdit" ui-sref="storageDetail({id:storage.id})" ng-bind="storage.name || '未设置'"></a>
          <input class="ui-input-fill" ng-if="storage.isEdit" ng-model="storage.name"/>
          <div class="item-header-option">
            <button class="dome-fa-icon fa fa-pencil dome-btn-none" ng-if="!storage.isEdit" ng-click="storage.isEdit = true" ng-class="{true:'icon-edit-color',false:'icon-fa-disabled'}[storage.count==0]" ng-disabled="false" tooltip="编辑"></button>
            <button class="dome-fa-icon fa fa-trash-o dome-btn-none" ng-if="!storage.isEdit" ng-click="deleteStorage(storage)" ng-class="{true:'icon-trash-color',false:'icon-fa-disabled'}[storage.count==0]" ng-disabled="false" tooltip="删除"></button>
            <button class="fa fa-floppy-o dome-btn-none icon-success-color" ng-if="storage.isEdit" ng-click="saveModify(storage);storage.isEdit = false" tooltip="保存"></button>
            <button class="fa fa-times dome-btn-none icon-cancel-color" ng-if="storage.isEdit" ng-click="cancelModify();storage.isEdit = false" tooltip="取消"></button>
          </div>
        </div>
        <div class="dome-list-item-content">
          <div class="item-content-block">存储类型：{{storage.type.toLowerCase()}}</div>
          <div class="item-content-block">使用数量：<span ng-init="getDeployCount(storage.id, $index)">{{storage.count}}</span></div>
          <div class="item-content-block">成员数：{{storage.memberCount}}</div>
          <div class="item-content-block"><span ng-if="!storage.isEdit" ng-bind="storage.description || '无描述信息'"></span>
            <input class="ui-input-fill" ng-if="storage.isEdit" ng-model="storage.description"/>
          </div>
        </div>
        <div class="dome-list-item-footer">
        <div class="item-footer-block">namespace：{{storage.namespace}}</div>
          <div class="item-footer-block">nfs服务器：<span ng-if="!storage.isEdit" class="txt-bright">{{storage.server}}</span>
          	<input class="ui-input-fill" ng-if="storage.isEdit" ng-model="storage.server"/>
          </div>
          <div class="item-footer-block">挂载路径：<span ng-if="!storage.isEdit" class="txt-success">{{storage.path}}</span>
          	<input class="ui-input-fill" ng-if="storage.isEdit" ng-model="storage.path"/>
          </div>
          <div class="item-footer-block">创建时间：{{(storage.createTime | date:'yyyy-MM-dd HH:mm:ss')}}</div>
          <div class="item-footer-block-other" style="display:inline-block;">创建者：{{storage.creatorName}}</div>
        </div>
      </li>
    </ul>
  </div>
</div>